import React from 'react';
import { observer, inject } from 'mobx-react';
import { routerShape } from 'react-router';
import { WeaTools,WeaErrorPage,WeaRightMenu,WeaTop,WeaLocaleProvider,WeaAlertPage } from 'ecCom';
import { Button } from 'antd';
import Condition from './Condition';
import * as _ from 'lodash';
import '../../style/batchToDoc.less';
const getLabel = WeaLocaleProvider.getLabel;

@inject("wfBatchToDocIndexStore")
@observer
class ToDocIndex extends React.Component{
    static contextTypes = {
        router: routerShape
    }
    componentDidMount(){
        this.doInit(this.props);
        if(window.location.pathname.indexOf('/spa/workflow/index') > -1)
            document.title = this.props.wfBatchToDocIndexStore.title;
    }
    componentWillReceiveProps(nextProps) {
        if(this.props.location.key !== nextProps.location.key)
        	this.doInit(nextProps);
    }
    doInit(props){
        const { wfBatchToDocIndexStore } = props;
        const queryParams = props.location.query || {};
        wfBatchToDocIndexStore.setUrlParams(queryParams);
        wfBatchToDocIndexStore.loadCondition();
    }
    resetHeight = (height) => {
        jQuery(".wf-todoc-condition").height(height - 60);
    }
    render(){
        const { wfBatchToDocIndexStore } = this.props;
        const { loading,title,hasRight } = wfBatchToDocIndexStore;
          if(!!!loading&&!!!hasRight){
            return <div>
                 <WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@u4w4sc`}
                        icon={<i className="icon-coms-locking" style={{ color: 'rgb(203, 203, 203)' }} />}
                        iconSize={120}
                        paddingTop={'15%'}
                    >
                        <div style={{ color: 'rgb(154, 154, 154)', paddingTop: "10px" }}>
                            {getLabel('2012', '对不起，您暂时没有权限！')}
                        </div>
                    </WeaAlertPage>
            </div>
        }

        return (
            <div className="wf-todoc-index">
                <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@h6y54y`} datas={this.getRightMenu()}>
                    <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@0ag173`}
                        title={title}
                        loading={loading}
                        icon={<i className='icon-coms-workflow' />}
                        iconBgcolor='#0079DE'
                        getHeight={this.resetHeight}
                        buttons={[]}
                        showDropIcon={true}
                        dropMenuDatas={this.getRightMenu()} 
                    >
                        <div className="wf-todoc-condition">
                            <Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@gytsvo`} store={wfBatchToDocIndexStore} onEnterSearch={this.forwardQueryResult} />
                        </div>
                        <div className="wf-todoc-btns">
                            {this.getSearchButtons()}
                        </div>
                    </WeaTop>
                </WeaRightMenu>
            </div>
        )
    }
    getRightMenu(){
    	let btns = [];
    	btns.push({
            key: "search",
    		icon: <i className='icon-workflow-Right-menu--search'/>,
            content:getLabel(197,'搜索'),
            onClick: this.forwardQueryResult
    	});
    	return btns;
    }
    getSearchButtons() {
        const { wfBatchToDocIndexStore } = this.props;
        const btnStyle = {borderRadius: 3, height: 28, width: 80}
        return [
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@1iqvjg@$search`} type="primary" style={btnStyle} onClick={this.forwardQueryResult}>{getLabel(197,'搜索')}</Button>),
            (<span style={{width:'15px', display:'inline-block'}}></span>),
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@ywrqzq@reset`} type="ghost" style={btnStyle} onClick={this.reset}>{getLabel(2022,'重置')}</Button>)
        ]
    }
    reset = ()=>{this.props.wfBatchToDocIndexStore.resetCondition()}
    forwardQueryResult = () => {
        const { wfBatchToDocIndexStore } = this.props;
        const { urlParams } = wfBatchToDocIndexStore;
        //路由跳转，跳转后做store拷贝条件
        this.context.router.push({
            pathname: "/main/workflow/batchToDocResult",
            query: {...{fromwhere:"index"}, ...urlParams}
        });
    }
}

export default WeaTools.tryCatch(React, 
    props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@qn2w6h`} msg={ props.error ? props.error : getLabel(383324,' 对不起，该页面异常，请联系管理员 ')+'！'} />,
    {error: ""}
)(ToDocIndex);